<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script src="../js/pixi.min.js"></script>
		<script type="text/javascript">
			var app=new PIXI.Application(700,480);
			document.body.appendChild(app.view);
			function add(src,x,y){
				var yuans=new PIXI.Sprite.fromImage(src);
				yuans.x=x;
				yuans.y=y;
				yuans.anchor.set(0.5,0.5)
				app.stage.addChild(yuans);
				yuans.interactive=true;
				return yuans;
			}
			function add2(src,x,y,zhu){
				var liao=new PIXI.Sprite.fromImage(src);
				liao.anchor.set(0.5,0.5);
				liao.x=x;
				liao.y=y;
				liao.scale.x=-1;
				zhu.addChild(liao);
			}
			 add("img/bg1.png",340,240);
			var xia= add("img/xia.png",300,400);
			var shang=add("img/shang.png",300,320);
			var you= add("img/you.png",350,365);
			var zuo= add("img/zuo.png",260,365);
			var ren=add("img/jack.png",100,300);
			
			add2("img/js4.png",100,100,ren);
			
			
			function move(){
				ren.x+1;
			}
			app.ticker.add(move);
			
			
			
			
			
			function moveshang(){
				ren.y+=5;
			}
			function movexia(){
				ren.y-=5;
			}
			function movezuo(){
			ren.scale.x=-1;	
			ren.x-=5;
			}
			function moveyou(){
			ren.scale.x=1;
			ren.x+=5;
			}
			shang.on("pointerdown",moveshang);
			xia.on("pointerdown",movexia);
			zuo.on("pointerdown",movezuo);
			you.on("pointerdown",moveyou);
		
			
			
			
			
			
		</script>
	</body>
</html>